<template>
    <view class="memberManagement">
        <view class="inputValueBox">
            <u--input focus v-model="valueData" customStyle="background: #fff;" @confirm="on_confirm" shape="circle"
                border="true" :adjustPosition="false" fontSize="14px" placeholder="商品名称/用户ID/昵称/手机号/支付宝账号/支付宝姓名/团队名称"
                prefixIcon="search" prefixIconStyle="font-size: 22px;color: #0000000;font-weight: 700;" />
        </view>

        <view class="ul" v-for="item in userList" :key="item.id">
            <div class="li">
                <div class="name">用户ID：</div>
                <div class="content">{{ item.id }}</div>
            </div>
            <div class="li">
                <div class="name">用户昵称：</div>
                <div class="content">{{ item.nickname }}</div>
            </div>
            <div class="li">
                <div class="name">升级会员时间：</div>
                <div class="content">{{ item.attract_investment_time }}</div>
            </div>
            <!-- <div class="li">
                <div class="name">性别：</div>
                <div class="content">
                    {{
                        detailsData.sex == 1 ? '男' : detailsData.sex == 2 ? '女' :
                        '未知'
                    }}
                </div>
            </div> -->


            <!-- <div class="li">
                <div class="name">地址：</div>
                <div class="content">{{ detailsData.address }}</div>
            </div> -->

            <!-- <div class="li">
                <div class="name">支付宝账号：</div>
                <div class="content">{{ detailsData.alipay }}</div>
            </div>

            <div class="li">
                <div class="name">支付宝姓名：</div>
                <div class="content">{{ detailsData.alipay_name }}</div>
            </div> -->

            <div class="li">
                <div class="name">合伙人：</div>
                <div class="content"> {{ (item.is_partner == 1 ? '是' : '否') }}
                </div>
            </div>
            <div class="li">
                <div class="name">联合创始人：</div>
                <div class="content">{{ (item.co_founder == 1 ? '是' : '否') }}</div>
            </div>
            <div class="li">
                <div class="name">会员等级：</div>
                <div class="content">{{ (item.level == 1 ? '园长' : item.level == 2 ? '团长' : '普通用户') }}
                </div>
            </div>
            <div class="li">
                <div class="name">团队名称：</div>
                <div class="content">{{ item.team_name ? item.team_name : '' }}</div>
            </div>
            <div class="li">
                <div class="name">第一上级：</div>
                <div class="content">{{ item.pid }}</div>
            </div>

            <div class="li">
                <div class="name">间推上级：</div>
                <div class="content">{{ item.gid }}</div>
            </div>
            <div class="li">
                <div class="name">积分：</div>
                <div class="content">{{ item.integral }}</div>
            </div>

            <div class="li">
                <div class="name">金额：</div>
                <div class="content">{{ item.money }}</div>
            </div>
            <!-- <div class="li">
                <div class="name">已消费金额：</div>
                <div class="content">{{ detailsData.yxf_money }}</div>
            </div> -->

            <!-- <div class="li">
                <div class="name">保证金：</div>
                <div class="content">{{ detailsData.bzj_money }}</div>
            </div> -->
            <!-- <div class="li">
                                <div class="name">积分：</div>
                                <div class="content">{{ detailsData.yj_money }}</div>
                            </div> -->
            <!-- <div class="li">
                <div class="name">扶持金：</div>
                <div class="content">{{ detailsData.fcj_money }}</div>
            </div> -->
            <div class="li">
                <div class="name">上级数量：</div>
                <div class="content">{{ item.depth ? item.depth : 0 }}</div>
            </div>
            <div class="li">
                <div class="name">用户状态：</div>
                <div class="content">
                    {{
                        item.status == 1 ? '启用' : '停用'
                    }}
                </div>
            </div>
            <div class="li liTwo">
                <div class="name">用户手机号：</div>
                <div class="content">{{ item.mobile }}</div>
            </div>

            <!-- <div class="li">
                <div class="name">是否新用户：</div>
                <div class="content">
                    {{
                        detailsData.is_old_user == 1 ? '旧系统用户' : '新用户'
                    }}
                </div>
            </div> -->

            <view class="btnBox">
                <view class="btn">
                    <u-button @click="on_operate(1, item)" :type="item.status == 1 ? 'error' : 'primary'"
                        :text="item.status == 1 ? '停用' : '启用'"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(2, item)" type="error" text="删除"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(3, item)" type="primary" text="修改等级"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(4, item)" type="primary" text="积分操作"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(5, item)" type="primary" text="积分记录"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(6, item)" type="primary" text="积分明细"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(7, item)" type="primary" text="余额操作"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(8, item)" type="primary" text="余额明细"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(9, item)" type="primary" text="提现明细"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(10, item)" type="primary" text="更改手机号"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(11, item)" type="primary" text="直推列表"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(12, item)" type="primary" text="间推列表"></u-button>
                </view>
                <!-- <view class="btn">
                    <u-button @click="on_operate(13, item)" type="primary" text="变更推荐关系"></u-button>
                </view> -->
                <view class="btn">
                    <u-button @click="on_operate(14, item)" type="primary" text="变更客服"></u-button>
                </view>
                <view class="btn">
                    <u-button @click="on_operate(15, item)" type="primary" text="直播红包明细"></u-button>
                </view>
            </view>

        </view>





        <view v-if="userList.length <= 0" class="noData">请搜索数据</view>


        <view class="pagination" v-if="total">
            <uni-pagination @change="on_change" :total="total"></uni-pagination>
            <view class="example">
                <text class="example-info">当前页：{{ page }}，数据总量：{{ total }}条，每页数据：{{ 10 }}</text>
            </view>
        </view>

        <u-modal @confirm="on_defineOperation(1)" @cancel="showType = false" :showCancelButton="true" :show="showType"
            title="修改等级">
            <view class="slot-content">
                <view class="selectBox">
                    <view class="name">用户等级：</view>
                    <view class="select">
                        <uni-data-select v-model="gradeForm.value1" :localdata="range"></uni-data-select>
                    </view>
                </view>
                <view class="selectBox" v-if="gradeForm.value1 == 2">
                    <view class="name">是否合伙人：</view>
                    <view class="select">
                        <uni-data-select v-model="gradeForm.value2" :localdata="typeList"></uni-data-select>
                    </view>
                </view>
                <view class="selectBox" v-if="gradeForm.value1 == 2">
                    <view class="name">是否联合创始人：</view>
                    <view class="select">
                        <uni-data-select v-model="gradeForm.value3" :localdata="typeList"></uni-data-select>
                    </view>
                </view>
            </view>
        </u-modal>



        <u-modal @confirm="on_defineOperation(2)" @cancel="showType1 = false" :showCancelButton="true" :show="showType1"
            title="积分变更">
            <view class="slot-content">
                <view class="selectBox">
                    <view class="name">操作类型：</view>
                    <view class="select">
                        <uni-data-select v-model="typeForm.value4" :localdata="range1"></uni-data-select>
                    </view>
                </view>

                <view class="selectBox">
                    <view class="name">积分值：</view>
                    <view class="select">
                        <u--input type="number" placeholder="请输入积分值" border="surround"
                            v-model="typeForm.value5"></u--input>
                    </view>
                </view>
            </view>
        </u-modal>


        <u-modal @confirm="on_defineOperation(3)" @cancel="showType2 = false" :showCancelButton="true" :show="showType2"
            title="余额变更">
            <view class="slot-content">
                <view class="selectBox">
                    <view class="name">操作类型：</view>
                    <view class="select">
                        <uni-data-select v-model="typeForm.value6" :localdata="range1"></uni-data-select>
                    </view>
                </view>

                <view class="selectBox">
                    <view class="name">余额值：</view>
                    <view class="select">
                        <u--input type="text" placeholder="请输入余额值" border="surround"
                            v-model="typeForm.value7"></u--input>
                    </view>
                </view>

                <view class="selectBox">
                    <view class="name">备注：</view>
                    <view class="select">
                        <u--textarea v-model="typeForm.value8" placeholder="请输入备注"></u--textarea>
                    </view>
                </view>

            </view>
        </u-modal>


        <u-modal @confirm="on_defineOperation(4)" @cancel="showType3 = false" :showCancelButton="true" :show="showType3"
            title="更改手机号">
            <view class="slot-content">
                <view class="selectBox">
                    <view class="name">更改手机号：</view>
                    <view class="select">
                        <u--input type="number" placeholder="请输入需要更改的手机号" border="surround"
                            v-model="typeForm.value8"></u--input>
                    </view>
                </view>
            </view>
        </u-modal>


        <u-modal @confirm="on_defineOperation(5)" @cancel="showType4 = false" :showCancelButton="true" :show="showType4"
            title="变更推荐关系">
            <view class="slot-content">
                <view class="selectBox">
                    <view class="name">需要变更推荐人的ID：</view>
                    <view class="select">
                        <u--input type="number" placeholder="请输入需要变更推荐人的ID" border="surround"
                            v-model="typeForm.value9"></u--input>
                    </view>
                </view>
            </view>
        </u-modal>


        <u-modal @confirm="on_defineOperation(6)" @cancel="showType5 = false" :showCancelButton="true" :show="showType5"
            title="变更客服">
            <view class="slot-content">
                <view class="selectBox">
                    <view class="name">当前绑定客服：</view>
                    <view class="select">
                        <view>{{ followUser }}</view>
                    </view>
                </view>
                <view class="selectBox">
                    <view class="name">选择变更客服：</view>
                    <view class="select">
                        <uni-data-select v-model="typeForm.value10" :localdata="followUserList"></uni-data-select>
                    </view>
                </view>
            </view>
        </u-modal>

        <u-loading-page loading-color="#1890ff" color="#fff" bg-color="rgba(0, 0, 0, 0.5)"
            :loading="loadingType"></u-loading-page>
    </view>
</template>

<script>
export default {
    data() {
        return {
            page: 1,
            total: 0,
            loadingType: false,
            valueData: '',
            typeForm: {
                value1: '',
                value2: '',
                value3: '',
                value4: 1,
                value5: '',
                value6: '',
                value7: '',
                value8: '',
                value9: '',
                value10: ''
            },
            typeList: [
                {
                    value: 0, text: '否'
                },
                {
                    value: 1, text: '是'
                }
            ],
            range: [
                { value: 0, text: "普通用户" },
                { value: 1, text: "园主" },
                { value: 2, text: "团长" },
            ],
            range1: [
                { value: 1, text: "增加" },
                { value: 2, text: "减少" },
            ],
            showType: false,
            showType1: false,
            showType2: false,
            showType3: false,
            showType4: false,
            showType5: false,
            userList: [],
            gradeForm: {
                value1: '',
                value2: '',
                value3: '',
            },
            userId: '',
            followUserList: [

            ],
            followUser: ""
        };
    },
    onShow() {
        this.ajax_mobileUserMsg()
    },
    methods: {
        on_change(page) {
            this.page = page.current;
            this.ajax_mobileUserMsg()
        },
        // 列表
        ajax_mobileUserMsg() {
            this.loadingType = true;
            this.$request.request({
                url: 'mobile/userMsg',
                method: 'POST',
                data: {
                    page: this.page,
                    value: this.valueData
                }
            }).then(res => {
                this.userList = res.data.data.data;
                this.total = res.data.data.total;

            }).finally(() => {
                this.loadingType = false;
            })
        },
        on_confirm() {
            this.ajax_mobileUserMsg()
        },
        on_operate(index, item) {
            this.userId = item.id
            if (index == 1) {
                uni.showModal({
                    title: '确认提示',
                    content: item.status == 1 ? "确认要停用该数据吗?" : '确认要启用该数据吗?',
                    confirmText: '确定',
                    cancelText: '取消',
                    success: (res) => {
                        if (res.confirm) {
                            // 用户点击确定
                            this.$request.request({
                                url: 'user/grade',
                                method: 'post',
                                data: {
                                    userId: item.id,
                                    status: item.status == 1 ? 0 : 1
                                }
                            }).then(res => {
                                uni.showToast({ title: '操作成功', icon: 'none' })
                                this.ajax_mobileUserMsg()
                            }).finally(() => {
                            })
                        } else if (res.cancel) {
                            // 用户点击取消
                        }
                    }
                })
            }
            if (index == 2) {
                uni.showModal({
                    title: '删除提醒',
                    content: '是否确认删除该条数据?',
                    success: (res) => {
                        if (res.confirm) {
                            // 用户点击确定
                            this.$request.request({
                                url: 'user/deleteUser',
                                method: 'post',
                                data: {
                                    userid: item.id
                                }
                            }).then(res => {
                                uni.showToast({ title: '操作成功', icon: 'none' })
                                this.ajax_mobileUserMsg()
                            }).finally(() => {
                            })
                        } else {

                        }
                    }
                });
            }
            if (index == 3) {
                console.log(item)
                this.gradeForm.value1 = item.level
                this.gradeForm.value2 = item.is_partner
                this.gradeForm.value3 = item.co_founder
                this.showType = true
            }
            if (index == 4) {
                this.typeForm.value5 = '';
                this.typeForm.value4 = 1;
                this.showType1 = true
            }
            if (index == 5) {
                uni.navigateTo({
                    url: '/pages/takeNotes?type=1&item=' + JSON.stringify(item)
                })
            }
            if (index == 6) {
                uni.navigateTo({
                    url: '/pages/takeNotes?type=2&item=' + JSON.stringify(item)
                })
            }
            if (index == 7) {
                this.typeForm.value8 = '';
                this.typeForm.value7 = '';
                this.typeForm.value6 = 1;
                this.showType2 = true
            }
            if (index == 8) {
                uni.navigateTo({
                    url: '/pages/takeNotes?type=3&item=' + JSON.stringify(item)
                })
            }
            if (index == 9) {
                uni.navigateTo({
                    url: '/pages/takeNotes?type=4&item=' + JSON.stringify(item)
                })
            }
            if (index == 10) {
                this.typeForm.value8 = ''
                this.showType3 = true
            }
            if (index == 11) {
                uni.navigateTo({
                    url: '/pages/takeNotes?type=5&item=' + JSON.stringify(item)
                })
            }
            if (index == 12) {
                uni.navigateTo({
                    url: '/pages/takeNotes?type=6&item=' + JSON.stringify(item)
                })
            }
            if (index == 13) {
                this.typeForm.value9 = ''
                this.showType4 = true
            }
            if (index == 14) {
                this.$request.request({
                    url: 'user/getFollowUserList',
                    method: 'post',
                    data: {
                        id: this.userId, //用户id
                    }
                }).then(res => {
                    this.typeForm.value10 = ''
                    this.followUser = res.data.list.info ? res.data.list.info : 无
                    const range = res.data.list.list.map(option => {
                        return {
                            value: option.id,
                            text: option.remark
                        }
                    })
                    this.followUserList = range
                    this.showType5 = true
                }).finally(() => {
                })
            }
            if (index == 15) {
                uni.navigateTo({
                    url: '/pages/takeNotes?type=7&item=' + JSON.stringify(item)
                })
            }
        },
        on_defineOperation(index) {
            if (index == 1) {
                this.$request.request({
                    url: 'user/userUpLeve',
                    method: 'post',
                    data: {
                        user_id: this.userId, //用户id
                        user_type: this.gradeForm.value1, //1：升级园主 2：升级团长
                        is_partner: this.gradeForm.value2, //0:不是合伙人 1：是合伙人   （团长用）
                        co_founder: this.gradeForm.value3 //0：不是联合创始人 1：是联合创始人  （团长用）
                    }
                }).then(res => {
                    this.showType = false;
                    uni.showToast({ title: '操作成功', icon: 'none' })
                    this.ajax_mobileUserMsg()
                }).finally(() => {
                })
            }
            if (index == 2) {
                if (!this.typeForm.value5) {
                    uni.showToast({ title: '请输入积分值', icon: 'none' })
                } else {
                    this.$request.request({
                        url: 'user/pointsChange',
                        method: 'post',
                        data: {
                            user_id: this.userId, //用户id
                            change_amount: this.typeForm.value5,
                            change_type: this.typeForm.value4,
                        }
                    }).then(res => {
                        this.showType1 = false;
                        uni.showToast({ title: '操作成功', icon: 'none' })
                        this.ajax_mobileUserMsg()
                    }).finally(() => {
                    })
                }
            }
            if (index == 3) {
                if (!this.typeForm.value7) {
                    uni.showToast({ title: '请输入余额值', icon: 'none' })
                } else {
                    this.$request.request({
                        url: 'user/moneyChange',
                        method: 'post',
                        data: {
                            user_id: this.userId, //用户id
                            change_amount: this.typeForm.value7,
                            change_type: this.typeForm.value6,
                            remark: this.typeForm.value8,
                        }
                    }).then(res => {
                        this.showType2 = false;
                        uni.showToast({ title: '操作成功', icon: 'none' })
                        this.ajax_mobileUserMsg()
                    }).finally(() => {
                    })
                }
            }
            if (index == 4) {
                if (this.typeForm.value8.length != 11) {
                    uni.showToast({ title: '请输入正确的手机号', icon: 'none' })
                } else {
                    this.$request.request({
                        url: 'user/updateMobile',
                        method: 'post',
                        data: {
                            userid: this.userId, //用户id
                            mobile: this.typeForm.value8
                        }
                    }).then(res => {
                        this.showType3 = false;
                        uni.showToast({ title: '操作成功', icon: 'none' })
                        this.ajax_mobileUserMsg()
                    }).finally(() => {
                    })
                }
            }
            if (index == 5) {
                if (!this.typeForm.value9) {
                    uni.showToast({ title: '请输入需要变更推荐人的ID', icon: 'none' })
                } else {
                    this.$request.request({
                        url: 'user/updataRecommend',
                        method: 'post',
                        data: {
                            userId: this.userId,
                            userMobile: this.typeForm.value9
                        }
                    }).then(res => {
                        this.showType4 = false;
                        uni.showToast({ title: '操作成功', icon: 'none' })
                        this.ajax_mobileUserMsg()
                    }).finally(() => {
                    })
                }
            }
            if (index == 6) {
                if (!this.typeForm.value10) {
                    uni.showToast({ title: '请选择变更客服', icon: 'none' })
                } else {
                    this.$request.request({
                        url: 'user/changeFollowUser',
                        method: 'post',
                        data: {
                            id: this.userId,
                            follow_id: this.typeForm.value10
                        }
                    }).then(res => {
                        this.showType5 = false;
                        uni.showToast({ title: '操作成功', icon: 'none' })
                        this.ajax_mobileUserMsg()
                    }).finally(() => {
                    })
                }
            }
        }
    },
};
</script>
<style lang="scss" scoped>
.memberManagement {
    padding: 20rpx;

    .slot-content {
        width: 100% !important;



    }

    .selectBox {
        // display: flex;
        // align-items: center;
        font-size: 14px;
        margin-top: 30rpx;

        .name {
            white-space: normal nowrap;
            margin-bottom: 20rpx;
        }

        .select {
            flex: 1;
            margin-top: 20rpx;
        }
    }

    .ul:nth-last-child(1) {
        border-bottom: none;
    }

    .ul {
        margin-top: 20rpx;
        display: flex;
        flex-wrap: wrap;
        font-size: 14px;
        border-bottom: 1px solid #ccc;
        padding-bottom: 20rpx;



        .li {
            margin-top: 20rpx;
            width: 50%;

            .name {
                margin-bottom: 6rpx;
            }
        }

        .liTwo {
            width: 100% !important;
        }
    }

    .btnBox {
        display: flex;
        margin-top: 20rpx;
        max-width: 100%;
        flex-wrap: wrap;
        justify-content: space-between;

        .btn {
            // margin-top: 20rpx;
            margin: 10rpx;
            min-width: 30%;
        }
    }
}
</style>